<template>
<!--  <van-dialog v-model:show="show" title="" show-cancel-button>
   <img src="../../assets/logo.png" />  
  <div class="win-info">
	  
  </div> 
  

</van-dialog> -->
	111
<!-- 	<van-dialog v-model="showDialog" title="Dialog Title" message="Dialog Message" >
	<div class="win-info">
		  
	</div> 
	</van-dialog> -->
	
	 <van-dialog
	    v-model:show="show"
	    title="Dialog Title"
	    :before-close="beforeClose"
	  >

		  
	  <div class="win-info">
	  	  
	  </div> 
	  
	  <template #title>
	       <div>
	         <span>Dialog Title</span>
	         <!-- 这里是你自定义的关闭按钮 -->
	         <van-icon name="close" @click="closeDialog" />
	       </div>
	     </template>
		 
	    <!-- 添加了 message 插槽，加入自定义的关闭按钮 -->
	   <!-- <template #message>
	      <div>
	         // 这里是你自定义的关闭按钮 
	        <span @click="closeDialog">自定义关闭按钮</span>
	      </div>
	    </template> -->
	  </van-dialog>
	  
</template>

<script>
	import { Dialog } from 'vant';
	// import { ref } from 'vue';
	
	// export default {
	//   setup() {
	//     const show = ref(true);
	//     return { show };
	//   },
	// };
	// export default {
	//   data() {
	//     return {
	//       showDialog: true,
	//     };
	//   },
	// };
	
	export default {
	  data() {
	   const show = true;
	   return { show };
	  },

	  methods: {
	    beforeClose(action, done) {
	      // 在这里可以执行一些关闭前的逻辑
	      // 如果你想要直接关闭对话框，调用 done() 即可
	      // 如果你想要阻止对话框关闭，不要调用 done()，或者调用 done(false)
	      // done();
		  // this.showDialog = false
		  done()
	    },
	    closeDialog() {
	      // 这里是自定义关闭按钮的点击事件
	      // this.showDialog = false;
		  // done();
		  this.show = false;
	    },

	  },
	  }
</script>

<style>
	.win-info {
		height: 50vh;
		/* 占屏幕的50% */
		/* background: url('background1.jpg') center/cover no-repeat;  背景图  */
		/* background-image: linear-gradient(rgba(208, 207, 254, 1), rgba(205, 218, 252, 0.5)); */
		background-image: linear-gradient(to right,rgba(161, 183, 246,1), rgba(162, 195, 247,1));
		position: relative;
	}
</style>